import { Component, createRef, useEffect, useRef, useState } from 'react'

export default function () {
  return (
    <body>
      <div className='page panel js_show'>
        <div className='page__hd'>
            <h1 className='page__title'>Panel</h1>
            <p className='page__desc'>面板</p>
        </div>
        <div className='page__bd'>
            <div className='weui-panel weui-panel_access'>
                <div className='weui-panel__hd'>图文组合列表</div>
                <div className='weui-panel__bd'>
                    <a href='javascript:' className='weui-media-box weui-media-box_appmsg'>
                        <div className='weui-media-box__hd'>
                            <img className='weui-media-box__thumb' src='' alt='' />
                        </div>
                        <div className='weui-media-box__bd'>
                            <h4 className='weui-media-box__title'>标题一</h4>
                            <p className='weui-media-box__desc'>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。</p>
                        </div>
                    </a>
                    <a href='javascript:' className='weui-media-box weui-media-box_appmsg'>
                        <div className='weui-media-box__hd'>
                            <img className='weui-media-box__thumb' src='' alt='' />
                        </div>
                        <div className='weui-media-box__bd'>
                            <h4 className='weui-media-box__title'>标题二</h4>
                            <p className='weui-media-box__desc'>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。</p>
                        </div>
                    </a>
                </div>
                <div className='weui-panel__ft'>
                    <a href='javascript:' className='weui-cell weui-cell_active weui-cell_access weui-cell_link'>
                        <div className='weui-cell__bd'>查看更多</div>
                        <span className='weui-cell__ft'></span>
                    </a>
                </div>
            </div>
            <div className='weui-panel weui-panel_access'>
                <div className='weui-panel__hd'>文字组合列表</div>
                <div className='weui-panel__bd'>
                    <div className='weui-media-box weui-media-box_text'>
                        <h4 className='weui-media-box__title'>标题一</h4>
                        <p className='weui-media-box__desc'>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。</p>
                    </div>
                    <div className='weui-media-box weui-media-box_text'>
                        <h4 className='weui-media-box__title'>标题二</h4>
                        <p className='weui-media-box__desc'>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。</p>
                    </div>
                </div>
                <div className='weui-panel__ft'>
                    <a href='javascript:' className='weui-cell weui-cell_active weui-cell_access weui-cell_link'>
                        <div className='weui-cell__bd'>查看更多</div>
                        <span className='weui-cell__ft'></span>
                    </a>
                </div>
            </div>
            <div className='weui-panel'>
                <div className='weui-panel__hd'>小图文组合列表</div>
                <div className='weui-panel__bd'>
                    <div className='weui-media-box weui-media-box_small-appmsg'>
                        <div className='weui-cells'>
                            <a className='weui-cell weui-cell_active weui-cell_access weui-cell_example' href='javascript:'>
                                <div className='weui-cell__hd'><img src='' alt='' /></div>
                                <div className='weui-cell__bd weui-cell_primary'>
                                    <p>文字标题</p>
                                </div>
                                <span className='weui-cell__ft'></span>
                            </a>
                            <a className='weui-cell weui-cell_active weui-cell_access weui-cell_example' href='javascript:'>
                                <div className='weui-cell__hd'><img src='' alt='' /></div>
                                <div className='weui-cell__bd weui-cell_primary'>
                                    <p>文字标题</p>
                                </div>
                                <span className='weui-cell__ft'></span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <div className='weui-panel'>
                <div className='weui-panel__hd'>文字列表附来源</div>
                <div className='weui-panel__bd'>
                    <div className='weui-media-box weui-media-box_text'>
                        <h4 className='weui-media-box__title'>标题一</h4>
                        <p className='weui-media-box__desc'>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。</p>
                        <ul className='weui-media-box__info'>
                            <li className='weui-media-box__info__meta'>文字来源</li>
                            <li className='weui-media-box__info__meta'>时间</li>
                            <li className='weui-media-box__info__meta weui-media-box__info__meta_extra'>其它信息</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
      </div>
    </body>
  )
}
